<!--
 * @Author: cgl
 * @Date: 2023-04-18 15:12:26
 * @LastEditors: cgl
 * @LastEditTime: 2023-08-11 10:31:26
 * @FilePath: \public-health-emergencies-fed:\radiation-hygiene-fe\src\views\report\abnormalReport.vue
 * @Description:
 *
 * Copyright (c) 2023 by cgl/微盛信息产业有限公司, All Rights Reserved.
-->
<template>
  <div class="app-container">
    <el-form
      class="searchform"
      @submit.native.prevent
      :model="queryParams"
      ref="queryParams"
      size="small"
      label-width="80px"
    >
      <el-row :gutter="20">
        <el-col :span="5">
          <el-form-item label="联系人">
            <el-input
              v-model="queryParams.contactsName"
              placeholder="请输入"
              clearable
              @keyup.enter.native="getList()"
            />
          </el-form-item>
        </el-col>
        <el-col :span="9">
          <el-form-item label-width="20px">
            <el-button
              type="primary"
              icon="el-icon-search"
              size="mini"
              @click="getList()"
              >搜索</el-button
            >
            <el-button icon="el-icon-refresh" size="mini" @click="reset()"
              >重置</el-button
            >
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>

    <el-table
      v-loading="loading"
      :data="exceptionalList"
      :height="height - 350 + 'px'"
      @row-dblclick="(row) => openDialog(row, '3')"
    >
      <el-table-column
        label="委托单位"
        align="center"
        prop="entrustOrganizationName"
        :show-overflow-tooltip="true"
      />
      <el-table-column label="年份" align="center" prop="year" width="100" />
      <el-table-column
        label="批次"
        align="center"
        prop="batchNum"
        width="100"
      />
      <el-table-column
        label="联系人"
        align="center"
        prop="contactsName"
        width="120"
      />
      <el-table-column
        label="联系电话"
        align="center"
        prop="contactsMobile"
        width="190"
      />
      <el-table-column
        label="异常报备时间"
        align="center"
        prop="createTime"
        width="150"
      />
      <el-table-column label="异常数" align="center" width="200">
        <template slot-scope="{ row }">
          <div
            @click="openDialog(row, '3')"
            class="viewfile noline"
            v-if="row.largeDoseCount"
          >
            大剂量({{ row.largeDoseComplete }}/{{ row.largeDoseCount }})
          </div>
          <div
            @click="openDialog(row, '3')"
            class="viewfile noline"
            v-if="row.lostOssCount"
          >
            剂量计缺失({{ row.lostComplete }}/{{ row.lostOssCount }})
          </div>
        </template>
      </el-table-column>
      <el-table-column label="状态" align="center" width="100">
        <template slot-scope="{ row }">
          <dict-tag
            :value="row.state"
            :options="dict.type.abnormal_state"
          ></dict-tag>
        </template>
      </el-table-column>
      <el-table-column align="center" label="操作">
        <template slot-scope="{ row }">
          <el-button
            v-if="row.state != '5'"
            @click.native.prevent="toURL(row)"
            type="text"
          >
            查看核查登记表
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 查看异常弹框 -->
    <el-dialog
      :title="title"
      :visible.sync="dialogVisible"
      :close-on-click-modal="false"
      width="1200px"
      v-dialogDrag="true"
    >
      <el-form
        class="abnormalform"
        :model="form"
        disabled
        ref="form"
        size="small"
        label-width="80px"
      >
        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="单位名称">
              <el-input v-model="form.entrustOrganizationName" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="联系人">
              <el-input v-model="form.contactsName" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="联系电话">
              <el-input v-model="form.contactsMobile" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>

      <div class="lostFileLabel">
        <span class="label">剂量计缺失说明文件：</span>
        <span
          v-if="lostFileList[0] && lostFileList[0].originalName"
          @click="viewFile(lostFileList[0].url)"
          class="viewfile lostFileList"
        >
          {{ lostFileList[0] && lostFileList[0].originalName }}
        </span>
      </div>

      <el-table
        :data="form.list"
        :height="status == '4' ? 410 : 364"
        class="detailtable"
        :class="status == '4' && 'notionaltable'"
      >
        <el-table-column
          label="姓名"
          align="center"
          prop="personnelName"
          width="100"
        />
        <el-table-column
          label="剂量编号"
          align="center"
          prop="dosageNumber"
          width="150"
        />
        <el-table-column label="职业类别" align="center">
          <template slot-scope="scope">
            <dict-tag
              :value="scope.row.occupationalClassification"
              :options="dict.type.occupational_classification"
            ></dict-tag>
          </template>
        </el-table-column>
        <el-table-column label="异常原因" align="center" width="150">
          <template slot-scope="scope">
            <span v-if="scope.row.exceptionType == '1'">剂量计缺失</span>
            <span v-if="scope.row.exceptionType == '2'">大剂量</span>
          </template>
        </el-table-column>
        <el-table-column
          label="异常报备时间"
          align="center"
          prop="createTime"
          width="190"
        />
        <el-table-column
          label="剂量当量(mSv)"
          align="center"
          prop="doseEquivalent"
          width="150"
        />
        <el-table-column label="名义剂量(mSv)" align="center" width="150">
          <template slot-scope="{ row }">
            <span v-if="status == '3'">{{ row.notionalDose }}</span>
            <el-input
              v-else
              class="notionalDoseinput"
              v-model="row.notionalDose"
              placeholder="请输入"
              size="mini"
              @change="handleSetNotionalDose(row)"
            />
          </template>
        </el-table-column>
        <el-table-column
          label="附件"
          align="center"
          width="120"
          v-if="status == '3'"
          :show-overflow-tooltip="true"
        >
          <template slot-scope="scope">
            <span
              v-if="scope.row.exceptionType == '2'"
              class="viewfile"
              @click="viewFile(scope.row.url)"
              >{{ scope.row.originalName }}</span
            >
          </template>
        </el-table-column>
        <el-table-column
          label="操作"
          align="center"
          width="120"
          v-if="status == '4'"
        >
          <template slot-scope="{ row }">
            <el-button @click.native.prevent="openSelectLiter(row)" type="text">
              选择名义剂量
            </el-button>
            <el-button
              @click.native.prevent="deleteDetail(row)"
              v-if="status == '3'"
              type="text"
              style="color: #f32d2d"
            >
              删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>

      <pagination
        class="detailpagination"
        v-show="detailtotal > 0"
        :total="detailtotal"
        :page.sync="detailQueryParams.pageNum"
        :limit.sync="detailQueryParams.pageSize"
        @pagination="getDetailList"
      />

      <div slot="footer">
        <el-button @click="dialogVisible = false">关 闭</el-button>
      </div>
    </el-dialog>

    <!-- 选择名义剂量弹框 -->
    <el-dialog
      title="选择名义剂量"
      :visible.sync="dialogVisibleSelectLiter"
      :close-on-click-modal="false"
      width="900px"
      class="selectLiterform"
      v-dialogDrag="true"
    >
      <el-form
        :model="selectLiterform"
        ref="form"
        size="small"
        label-width="100px"
      >
        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="姓名">
              <el-input v-model="selectLiterform.personnelName" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="异常报备时间">
              <el-input v-model="selectLiterform.createTime" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="剂量编号">
              <el-input v-model="selectLiterform.dosageNumber" disabled />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>

      <el-table :data="selectLiterform.list" height="250">
        <el-table-column label="剂量类型" align="center" prop="key" />
        <el-table-column label="mSv" align="center" prop="value" />
        <el-table-column align="center" label="操作" width="200">
          <template slot-scope="{ row }">
            <el-button
              :disabled="!row.value"
              @click.native.prevent="handleUse(row)"
              type="text"
            >
              使用
            </el-button>
          </template>
        </el-table-column>
      </el-table>

      <div slot="footer">
        <el-button @click="dialogVisibleSelectLiter = false">关 闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import {
  exceptionalRecordDetailsPage,
  removeExceptional,
  exceptionalRecordDetailsIInfo,
  uploadHandleFile,
  updateHandle,
  exceptionalRecordDetailsUpload,
  exceptionalQueryPageList,
  exceptionalSendSMS,
  downloadLargeDose,
  downloadLost,
  getConfiglargeDose,
  setNotionalDose,
  exceptionalAudit,
  getNotionalDoseSelectList,
  exceptionalComplete,
} from "@/api/slides/abnormal";
import { entrustOrganizationListing } from "@/api/person/entrustOrganization";
import {
  personalDosimeterReportList,
  detectionEquipmentReportList,
  exceptionalReportList,
} from "@/api/report/report";
import { listOss, listByIds, delOss } from "@/api/system/oss";

export default {
  name: "User",
  dicts: ["occupational_classification", "abnormal_state"],
  data() {
    return {
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
      },
      total: 0,
      dialogVisible: false,
      // 视图高度
      height: document.documentElement.clientHeight,
      // 表单参数
      form: {},
      loading: false,
      status: null,
      title: null,
      // 列表
      exceptionalList: [],
      // 名义剂量弹框
      dialogVisibleSelectLiter: false,
      selectLiterform: {},
      literform: {},
      openRow: {},
      openSelectRow: {},
      // 剂量计缺失说明文件
      lostFileList: [],
      // 详情列表
      detailQueryParams: {
        pageNum: 1,
        pageSize: 10,
      },
      detailtotal: 0,
    };
  },
  created() {
    this.getList();
  },
  methods: {
    // 获取异常单位列表
    getList() {
      this.loading = true;
      exceptionalReportList(this.queryParams)
        .then((response) => {
          this.exceptionalList = response.rows;
          this.total = response.total;
          this.loading = false;
        })
        .catch((response) => {
          this.loading = false;
        });
    },
    // 打开对话框
    openDialog(row, status) {
      this.resetForm("form");
      this.form = {
        list: [],
      };
      if (row) {
        this.openRow = row;
        this.lostFileList = [];
        if (row.lostOssId) {
          listByIds(row.lostOssId).then((response) => {
            if (response.data[0]) {
              this.lostFileList.push({
                originalName: response.data[0].originalName,
                url: response.data[0].url,
              });
            }
          });
        }
        // 分页获取详情列表
        this.detailQueryParams.pageNum = 1;
        this.detailQueryParams.pageSize = 10;
        this.getDetailList();
        this.status = status;
        if (status == "3") {
          this.title = "查看异常";
        }
        if (status == "4") {
          this.title = "名义剂量";
        }
      } else {
      }
    },
    // 分页获取详情列表
    getDetailList(type) {
      this.detailQueryParams.exceptionalRecordId =
        this.openRow.exceptionalRecordId;
      exceptionalRecordDetailsPage(this.detailQueryParams).then((response) => {
        this.form.list = response.rows;
        if (type == "isdelete" && this.form.list.length == 0) {
          this.dialogVisible = false;
          this.getList();
          return;
        }
        this.form.list.forEach((item) => {
          if (item.ossId && item.exceptionType == "2") {
            listByIds(item.ossId).then((response) => {
              if (response.data[0]) {
                this.$set(item, "originalName", response.data[0].originalName);
                item.url = response.data[0].url;
              }
            });
          }
        });
        this.form.entrustOrganizationName =
          this.openRow.entrustOrganizationName;
        this.form.contactsName = this.openRow.contactsName;
        this.form.contactsMobile = this.openRow.contactsMobile;
        this.detailtotal = response.total;
        this.dialogVisible = true;
      });
    },
    // 跳转链接页面
    toURL(row) {
      // this.$router.push({ path: '/work/table', query: {exceptionalRecordId: row.exceptionalRecordId }})
      this.$router.push({
        path: "/work/table",
        query: { exceptionalRecordId: row.exceptionalRecordId },
      });
    },
    // 发送短信
    sendMessage(row) {
      this.$modal
        .confirm(
          `是否发送核查登记表短信至 [${row.contactsName}]，电话号码：${row.contactsMobile}？`
        )
        .then(() => {
          this.loading = true;
          return exceptionalSendSMS(row.exceptionalRecordId);
        })
        .then(() => {
          this.loading = false;
          this.$modal.msgSuccess("发送成功");
          this.getList();
        })
        .finally(() => {
          this.loading = false;
        });
    },
    // 列表文件预览
    viewFile(url) {
      if (url) {
        window.open(url, "PDF", "");
      } else {
        this.$modal.msgWarning("暂无文件");
      }
    },
    // 查看异常删除
    deleteDetail(row) {
      this.$modal.confirm(`确定删除该数据吗？`).then(() => {
        removeExceptional(row.exceptionalRecordDetailsId).then((response) => {
          this.$modal.msgSuccess("删除成功");
          this.getDetailList("isdelete");
        });
      });
    },
    // 打开选择名义剂量弹框
    openSelectLiter(row) {
      this.dialogVisibleSelectLiter = true;
      this.selectLiterform = {
        ...row,
        list: [],
      };
      this.openSelectRow = row;
      getNotionalDoseSelectList({
        exceptionalRecordId: this.openRow.exceptionalRecordId,
        detailsId: row.exceptionalRecordDetailsId,
      }).then((response) => {
        this.selectLiterform.list = response.data;
      });
    },
    // 使用
    handleUse(row) {
      this.$modal
        .confirm(`是否确认使用 [${row.key}] 作为名义剂量？`)
        .then(() => {
          return setNotionalDose(
            this.openSelectRow.exceptionalRecordDetailsId,
            row.value
          );
        })
        .then(() => {
          this.dialogVisibleSelectLiter = false;
          this.openDialog(this.openRow, "4");
        })
        .finally(() => {});
    },
    // 输入框更改时使用
    handleSetNotionalDose(row) {
      if (!row.notionalDose) {
        return;
      }
      if (isNaN(row.notionalDose)) {
        this.$modal.msgWarning("请输入正确的格式");
        return;
      }
      setNotionalDose(row.exceptionalRecordDetailsId, row.notionalDose).then(
        (response) => {
          this.$modal.msgSuccess(`设置成功`);
        }
      );
    },
    // 通过/驳回
    handleAudit(row, state) {
      this.$modal
        .confirm(`是否确认${state == "0" ? "驳回" : "通过"}该异常信息 ？`)
        .then(() => {
          this.loading = true;
          return exceptionalAudit({
            exceptionalRecordId: row.exceptionalRecordId,
            state: state,
          });
        })
        .then(() => {
          this.loading = false;
          this.$modal.msgSuccess(`${state == "0" ? "驳回" : "通过"}成功`);
          this.getList();
        })
        .finally(() => {
          this.loading = false;
        });
    },
    // 完成
    handleComplete(row) {
      this.$modal
        .confirm(`是否确认完成该异常信息 ？`)
        .then(() => {
          this.loading = true;
          return exceptionalComplete({
            exceptionalRecordId: row.exceptionalRecordId,
          });
        })
        .then(() => {
          this.loading = false;
          this.$modal.msgSuccess(`操作成功`);
          this.getList();
        })
        .finally(() => {
          this.loading = false;
        });
    },
    // 表单重置
    reset() {
      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
      };
      this.resetForm("queryParams");
      this.getList();
    },
    // 关闭
    closeExam() {
      if (this.status != "3") {
        this.$refs.upload.clearFiles();
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.operation {
  margin-bottom: 15px;
  .register {
    padding-inline: 30px;
  }
}
.uploadbutton {
  padding-inline: 20px;
}
.myupload {
  margin-bottom: 20px;
}
.result {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 30px;
  .calc {
    width: min-content;
    margin-left: 20px;
    .el-button {
      margin: 0;
      &:nth-of-type(1) {
        margin-bottom: 10px;
      }
    }
  }
}
.nametitle {
  text-align: center;
  margin-bottom: 10px;
  font-weight: bolder;
  &::before {
    content: "* ";
    color: red;
  }
}
.el-table .warning-row {
  background: rgb(228, 13, 13);
}
.searchcontainer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: -10px;
}
.viewform {
  justify-content: flex-end;
}
.title {
  padding-left: 10px;
  border-left: 5px solid #2a72ee;
  text-align: left;
  font-weight: bolder;
  font-size: 16px;
  margin-bottom: 30px;
}
.viewfile {
  color: #2a72ee;
  cursor: pointer;
  margin-right: 10px;
  width: fit-content;
  &:hover {
    color: #2a72ee;
    text-decoration: underline;
  }
  &.noline {
    width: auto;
  }
  &.noline:hover {
    text-decoration: none;
  }
}
.selectLiterform ::v-deep .el-form {
  margin-left: -55px;
}
.notionalDoseinput {
  width: 70%;
}
.detailtable {
  margin-bottom: 50px;
}
.notionaltable {
  ::v-deep .el-table__cell {
    padding: 0;
  }
}
.detailpagination {
  margin-bottom: 20px;
}
.lostFileLabel {
  margin-bottom: 10px;
  padding-left: 12px;
  .label {
    font-size: 14px;
    color: #606266;
    font-weight: 700;
  }
  .lostFileList {
  }
}
</style>
